{include file="public/header"}
<body>
<style>
    body{
        margin: 0;
        padding: 0;
    }
    a {
        text-decoration: none;
        color: #fff;
        font-size: 12px;
    }
    .jOrgChart{
        width: 96%;
        text-align: center;
        padding-left: 1em;
        padding-bottom: 1em;
    }
    .jOrgChart .node {
        width: 120px;
        height: 50px;
        line-height: 50px;
        border-radius: 4px;
        margin: 0 8px;
    }
</style>

<!--显示组织架构图-->
<div id='jOrgChart' class="jOrgChart"></div>

{include file="public/footer"}

<script type='text/javascript'>
    $(function(){
        //数据返回
        $.ajax({
            url: "{:url('admin/agent/construct')}",
            type: 'POST',
            dataType: 'JSON',
            data: {action: 'org_select'},
            success: function(result){
                var showlist = $("<ul id='org' style='display:none'></ul>");
                showall(result.data, showlist);
                $("#jOrgChart").append(showlist);
                $("#org").jOrgChart( {
                    chartElement : '#jOrgChart',//指定在某个dom生成jorgchart
                    dragAndDrop : true //设置是否可拖动
                });

            }
        });
    });

    function showall(menu_list, parent) {
        $.each(menu_list, function(index, val) {
            if(val.childrens.length > 0){

                var li = $("<li></li>");
                li.append("<a href='javascript:void(0)' onclick=getOrgId("+val.id+");>"+val.name+"</a>").append("<ul></ul>").appendTo(parent);
                //递归显示
                showall(val.childrens, $(li).children().eq(1));
            }else{
                $("<li></li>").append("<a href='javascript:void(0)' onclick=getOrgId("+val.id+");>"+val.name+"</a>").appendTo(parent);
            }
        });

    }

</script>

</body>
</html>